<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>

<body class="white-bg">

<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="saleOrder-form">
                <div class="select-list">
                    <ul>
                        <li>订单编号：<input type="text" name="saleorderno"/>
                        </li>

                        <li>支付状态：<select name="payState" id="status">
                            <option value="">所有</option>
                            <option value="1">未支付</option>
                            <option value="2">已支付</option>
                        </select>
                        </li>
                        <li>理发师：<select name="barberId" id="bname"
                                        style="width: 80px;">

                        </select>
                        </li>
                        <li>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">创建时间：</label>
                                <div class="col-sm-8">
                                    <input id="Screatetime" name="ScreateTime" placeholder="输入开始时间"
                                           class="form-control" type="text">至<input id="Fcreatetime" name="FcreateTime"
                                                                                    placeholder="输入结束时间"
                                                                                    class="form-control" type="text">
                                </div>
                            </div>
                        </li>
                        <!-- 							<li>
                                                        <div class="form-group">
                                                            <label class="col-sm-3 control-label">支付时间:</label>
                                                            <div class="col-sm-8">
                                                                <input id="endtime" name="endTime" placeholder="输入支付时间" class="form-control"
                                                                    type="text">
                                                            </div>
                                                        </div>
                                                    </li> -->

                        <li><a class="btn btn-primary btn-rounded btn-sm"
                               onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm"
                               onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>

                </div>
            </form>
        </div>
        <div class="btn-group-sm hidden-xs" id="toolbar" role="group">
            <!-- <a class="btn btn-success" onclick="$.operate.add()"> <i
                class="fa fa-plus"></i> 新增
            </a> -->
            <a class="btn btn-primary btn-edit disabled"
               onclick="$.operate.edit()"> <i class="fa fa-edit"></i> 修改
            </a>
            <!-- <a class="btn btn-danger btn-del disabled"
                onclick="$.operate.removeAll()"> <i class="fa fa-remove"></i>
                删除
            </a> -->

        </div>

        <div class="col-sm-12 select-table table-striped">
            <table id="bootstrap-table" data-mobile-responsive="true"></table>
        </div>
    </div>
</div>


<div th:include="include :: footer"></div>
<script th:inline="javascript">

    /* 分界线 */

    $('.form_datetime').datetimepicker({
        //language:  'fr',
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1
    });
    $("#Screatetime").datetimepicker({//选择年月日
        format: 'yyyy-mm-dd',
        language: 'zh-CN',
        weekStart: 1,
        todayBtn: 1,//显示‘今日’按钮
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        minView: 2,  //Number, String. 默认值：0, 'hour'，日期时间选择器所能够提供的最精确的时间选择视图。

        clearBtn: false,//清除按钮

        forceParse: 0
    });
    $("#Fcreatetime").datetimepicker({//选择年月日
        format: 'yyyy-mm-dd',
        language: 'zh-CN',
        weekStart: 1,
        todayBtn: 1,//显示‘今日’按钮
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        minView: 2,  //Number, String. 默认值：0, 'hour'，日期时间选择器所能够提供的最精确的时间选择视图。

        clearBtn: false,//清除按钮

        forceParse: 0
    });

    /* 分界线 */


    var prefix = "/order";

    $(function () {
        var options = {
            url: prefix + "/list",
            createUrl: prefix + "/add",
            updateUrl: prefix + "/edit/{id}",
            removeUrl: prefix + "/remove",
            modalName: "订单",
            search: false,
            showExport: false,
            columns: [
                {
                    checkbox: true
                },
                {
                    field: 'orderId',
                    visiable: false

                },
                {
                    field: 'saleorderno',
                    title: '订单编号'
                },
                {
                    field: 'vipId',
                    title: '会员卡号',
                    sortable: true
                },
                {
                    field: 'receivable',
                    title: '原价',
                    sortable: true
                },
                {
                    field: 'total',
                    title: '折后价',
                    sortable: true
                },
                {
                    field: 'paid',
                    title: '实付',
                    sortable: true
                },
                {
                    field: 'change',
                    title: '找零',
                    sortable: true
                },
                {
                    field: 'bname',
                    title: '理发师',

                },
                {
                    field: 'cname',
                    title: '收银员',

                },

                {
                    field: "payState",
                    title: '支付状态',
                    align: 'center',
                    formatter: function (value) {
                        switch (value) {
                            case 1:
                                return '未支付'
                            case 2:
                                return '已支付'
                        }
                    }
                },
                {
                    field: 'createTime',
                    title: '创建时间',
                    sortable: true

                },
                {
                    field: 'endTime',
                    title: '支付时间',
                    sortable: true

                },

                {
                    field: "paymentType",
                    title: '支付类型',
                    align: 'center',
                    formatter: function (value) {
                        switch (value) {
                            case 1:
                                return '微信'
                            case 2:
                                return '支付宝'
                            case 3:
                                return '现金'
                            case 4:
                                return '会员卡抵扣'
                        }
                    }
                },

                {
                    title: '操作',
                    align: 'center',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions
                            .push('<a class="btn btn-success btn-xs '
                                + ''
                                + '" href="#" onclick="$.operate.edit(\''
                                + row.orderId
                                + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        /*  actions.push('<a class="btn btn-danger btn-xs ' + '' + '" href="#" onclick="$.operate.remove(\'' + row.roleId + '\')"><i class="fa fa-remove"></i>删除</a>'); */
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
        $('select#status').change(function () {
            $.table.search()
        });
        barberName();

        function barberName() {
            $.ajax({
                type: "post",
                url: "/order/selectBname",
                dataType: "json",
                success: function (res) {
                    if (null != res) {
                        var html = '  <option value="">所有</option>';
                        Object
                            .keys(res)
                            .forEach(
                                function (key) {
                                    html += '<option value="' + res[key].uid + '" class="choice">'
                                        + res[key].name
                                        + '</option>';
                                });
                        $('#bname').html(html);

                    }
                }
            });
        }

        $('select#bname').change(function () {
            $.table.search()
        })

    });
</script>
</body>
</html>